<!DOCTYPE html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="keywords" content="">
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="icon" href="assets/images/favicon.png" type="image/png">
  <title></title>
    <link href="assets/css/icons.css" rel="stylesheet">
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/css/style.css" rel="stylesheet">
    <link href="assets/css/responsive.css" rel="stylesheet">
    
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
          <script src="js/html5shiv.min.js"></script>
          <script src="js/respond.min.js"></script>
    <![endif]-->

    <script src="https://cdn.jsdelivr.net/npm/vue"></script>

</head>

<body class="sticky-header">


<!--Start left side Menu-->
<div id="nav-left" class="left-side sticky-left-side">
</div>
    
    <!-- main content start-->
    <div class="main-content" >

        <!-- header section start-->
        <!--        <script src="assets/js/commonPage/header.js"></script>-->
        <div class="header-section">

            <a class="toggle-btn"><i class="fa fa-bars"></i></a>

            <form class="searchform">
                <input type="text" class="form-control" name="keyword" placeholder="Search here..."/>
            </form>

            <!--notification menu start -->
            <div class="menu-right">
                <ul class="notification-menu">
                    <li>
                        <a href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                            <img :src="avatar" alt=""/>
                            头像
                            <span class="caret"></span>
                        </a>
                        <ul class="dropdown-menu dropdown-menu-usermenu pull-right">
                            <li><a href="#"> <i class="fa fa-wrench"></i> uff </a></li>
                            <li><a href="#"> <i class="fa fa-user"></i> Profile </a></li>
                            <li><a href="#"> <i class="fa fa-info"></i> Help </a></li>
                            <li><a href="#"> <i class="fa fa-lock"></i> Logout </a></li>
                        </ul>
                    </li>

                </ul>
            </div>
            <!--notification menu end -->

        </div>
        <!-- header section end-->



        <!--body wrapper start-->
        <div class="wrapper">
              
              <!--Start Page Title-->
               <div class="page-title-box">
                    <h4 class="page-title">Basic Table</h4>
                    <ol class="breadcrumb">
                        <li>
                            <a href="#">Dashboard</a>
                        </li>
                        <li>
                            <a href="#">Table</a>
                        </li>
                        <li class="active">
                            Basic Table
                        </li>
                    </ol>
                    <div class="clearfix"></div>
                 </div>
                  <!--End Page Title-->          
           
           
               <!--Start row-->
               <div class="row">
             
               <!-- Start Basic Table-->
                <div class="col-md-12" >
                 <div class="white-box">
                    <h2 class="header-title">用户反馈信息</h2>
                     <div class="table-wrap" id="vue">
                            <table class="table">
                          <thead>
                          <input type="text"  id="message" placeholder="输入查询信息">
                          <input name="submit" id="submit" class="btn btn-secondary" value="查询"  v-on:click="select()" type="button">

                          <input name="submit" id="butten" class="btn btn-secondary" value="查询所有"  v-on:click="selectAll()" type="button">
                            <tr>
                              <th>用户名</th>
                              <th>反馈信息</th>
                              <th>反馈时间</th>
                            </tr>
                          </thead>
                          <tbody>
                            <tr v-for="feed in list">
                              <td>{{feed.userName}}</td>
                              <td>{{feed.message}}</td>
                              <td>{{feed.createTime}}</td>
                            </tr>
                          </tbody>
                        </table>
                     </div>
                 </div>
                 </div>
               <!-- End Basic Table-->
               </div>
        </div>
    </div>

    <!--Begin core plugin -->
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/plugins/moment/moment.js"></script>
    <script  src="assets/js/jquery.slimscroll.js "></script>
    <script src="assets/js/jquery.nicescroll.js"></script>
    <script src="assets/js/functions.js"></script>
    <!-- End core plugin -->

    <!--Begin core plugin -->
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src = "assets/js/util/http-util.js"></script>
    <!-- End core plugin -->
</body>
<script>
    $(function () {
        $('#footer').load('footer.html');
        $('#nav-left').load('nav-left.html');
    })
</script>
</html>
<script>
    let vm = new Vue({
        el:'#vue',
        data:{
            list: []
        },
        methods: {
            select :function() {
                let url = "/shop_admin/sellectmessage";
                let thisObj = this;
                let message = $("#message").val();
                let params = {message: message};
                doPost(url, params, function (data) {
                    thisObj.list = data;
                    alert("查询成功");
                });
            },
            selectAll: function() {
                //发起http请求后台获取商家列表数据
                let url = "/shop_admin/selectAll";
                let thisObj = this;
                doGet(url, function (data) {
                    thisObj.list = data;
                })
            },
            getAvatar: function () {
                console.log("进入方法");
                let url = "/shop_admin/getAvatar";
                let thisObj = this;
                doGet(url, function (resp) {
                    thisObj.avatar = "assets/images/avatar/" + resp;
                    console.log(thisObj.avatar);
                })
            },
        },

        mounted:function () {
            this.selectAll();
            this.select();
            this.getAvatar();
        },
        created: function () {
            console.log("created");
         }
    });
</script>